<template>
  <template v-for="item in items">
    <template v-if="item.type === 1">
      <el-sub-menu :index="item.path" :key="item.id">
        <template #title>
          <el-icon v-if="item.icon">
            <component :is="item.icon"></component>
          </el-icon>
          <span>{{ item.title }}</span>
        </template>
        <WMenu :items="item.items" />
      </el-sub-menu>
    </template>
    <template v-else-if="item.type === 2">
      <el-menu-item :index="item.path" :key="item.id">
        <el-icon v-if="item.icon">
          <component :is="item.icon"></component>
        </el-icon>
        <template #title>{{ item.title }}</template>
      </el-menu-item>
    </template>
  </template>
</template>

<script setup lang="ts" name="w-menu">
import type { IMenu } from "@/types/menu";
import WMenu from "./MenuView.vue";

defineProps({
  items: Array<IMenu>
});
</script>
<style scoped lang="scss"></style>
